<template>
  <div>
    <!-- <div class="table-page-search-wrapper">
      <a-form layout="inline" @keyup.enter.native="searchQuery">
        <a-row :gutter="24" type="flex" justify="end">
          <a-col :md="6" :sm="8">
            <a-form-item label="名称" :labelCol="{span: 5}" :wrapperCol="{span: 18, offset: 1}">
              <a-input :allowClear="clear"></a-input>
            </a-form-item>
          </a-col>
          <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
            <a-col :md="6" :sm="24">
              <a-button type="primary" @click="loadData(true)">查询</a-button>
              <a-button style="margin-left: 8px">重置</a-button>
            </a-col>
          </span>
        </a-row>
      </a-form>
    </div> -->
    <a-table
      ref="table"
      rowKey="id"
      size="middle"
      :columns="columns"
      :dataSource="gDataSource"
      :pagination="gPagination"
      @change="gHandleTableChange"
    >
      <span slot="sortCol" slot-scope="text, record, index">
        {{
          (gPagination.current - 1) * gPagination.pageSize + parseInt(index) + 1
        }}
      </span>
      <!-- <span slot="action" slot-scope="text, record">
        <a @click="handleDetail(record)">监控详情</a>
      </span> -->
    </a-table>
    <!-- <detail-modal ref="detailModal"></detail-modal> -->
  </div>
</template>

<script>
import moment from "moment";
import { GwListMixin } from "@/mixins/GwListMixin";
import { gPostAction } from "@/api/manage";
// import DetailModal from './modules/device/DetailModal'

export default {
  name: "Diagnosis",
  mixins: [GwListMixin],
  components: {
    // DetailModal,
  },
  props: {
    modelType: {
      type: String,
      default: ''
    },
  },
  data() {
    return {
      // 表头
      columns: [
        {
          title: "序号",
          dataIndex: "",
          key: "rowIndex",
          width: 100,
          scopedSlots: { customRender: "sortCol" },
        },
        {
          title: "来源",
          dataIndex: "resourceName",
          customRender: function (t, r, index) {
            return r.resourceName || r.resourceId;
          },
        },
        {
          title: "监控项",
          width: 160,
          dataIndex: "meter",
        },
        {
          title: "资源类型",
          width: 100,
          dataIndex: "resourceType",
        },
        {
          title: "等级",
          width: 60,
          dataIndex: "levelCnName",
        },
        {
          title: "告警内容 ",
          dataIndex: "content",
        },
        {
          title: "告警时间 ",
          width: 150,
          dataIndex: "alertTime",
          customRender: function (t, r, index) {
            return moment(t).format("YYYY-MM-DD HH:mm:ss");
          },
        },
        // {
        //   title: '操作',
        //   dataIndex: 'action',
        //   align: 'center',
        //   scopedSlots: { customRender: 'action' },
        // },
      ],
      url: {
        list: "/history/page",
      },
    };
  },
  mounted() {
    this.loadData();
  },
  methods: {
    loadData() {
      if (this.modelType === 'f010104') {
        this.gQueryParam.resourceTypes = '';
        this.gQueryParam.title = "精确管控与供电制冷联动-基础资源粒度感知-诊断告警-诊断告警信息";
      } else if (this.modelType === 'f010305') {
        this.gQueryParam.resourceTypes = new Array("air", "ups");
        this.gQueryParam.title = "精确管控与供电制冷联动-供电制冷最优模型-供电制冷设备告警管理-诊断告警";
      }
      gPostAction(this.url.list, this.gQueryParam).then(
        (res) => {
          const data = res.data;
          if (data && data.list) {
            this.gDataSource = data.list;
            this.gPagination.total = data.totalCount;
          }
        }
      );
    },
    handleDetail(data) {
      this.$refs.detailModal.showModal(data);
    },
  },
};
</script>
<style scoped>

</style>
